var vm = new Vue({
        el: "#myCollection",
        data: {
            searchs:'',
            product:[],                 //收藏商品
            loseProduct:[],             //失效商品
            store:[],                   //收藏店铺
            classify:[],                //分类
            classification: false,
            categories: false,
            show:false,
            loading: true,
            user_id:'',
            user_name:'',
            web_token:'',
            supplier_type:'',
            type:0,
            page_type:1,                //1:商品,2商铺
            pageNo: 1,                  //全部商品的页码
            paginate:'',
            page_no: 1,                 //收藏店铺的页码
            html:'',
            oss_url:oss_url,
            nodata:''
        },
        methods: {
            delProduct:function (index,id) {
                if (!this.user_id ){
                    location.href = "/userweb/index/login.html";
                }
                var url = '/api/Collection/delCollectProduct';
                if (index == 1){    //单个删除
                    var data = {
                        id:  id
                    };
                }
                if (index == 2){    //批量删除
                    var arr = '', flag = 0;
                    $("#allProduct input[name='ids']:checkbox").each(function (i, v) {
                        if (true == $(v).prop("checked")) {
                            //arr.push($(this).val());
                            arr += $(this).val()+',';
                            flag++;
                        }
                    });
                    if (flag === 0) {
                        layer.msg("请选择要删除的收藏商品</br>Please choose of product to be deleted",{
                            skin:'winning-class',
                            time:3000
                        });
                        return false;
                    }
                    arr = arr.substring(0,arr.length-1);
                    var data = {
                        id:  arr
                    };
                }
                this.$http.post(url, data, {
                    emulateJSON: true
                }).then(function (res) {
                    layer.msg(res.data.msg,{
                        skin:'winning-class',
                        time:3000
                    });
                    this.collectProduct(this.type);
                }, function (res) {

                });
            },
            collectSupplier: function () {
                this.loading    = true;
                this.classification = true;
                this.page_type = 2;
                var url = '/api/Collection/collectSupplier';
                var data = {
                    user_id:        this.user_id,
                    type:           this.supplier_type,
                    search:         '',
                    page:           this.page_no,
                    typeSos:        'web'
                };
                this.$http.post(url, data, {
                    emulateJSON: true
                }).then(function (res) {
                    if (res.data.status == 200) {
                        this.store  = res.data.collect.data;
                        this.html   = res.data.html;
                        if (this.html){
                            this.html   = this.html.replace(/jump/, "JumTwo");
                            this.html   = this.html.replace(/page_no/, "pageNo");
                        }
                        for (var i=0;i<this.store.length;i++){
                            this.store[i]['image']  = this.oss_url+this.store[i]['image'];
                            this.store[i]['star']   = star(this.store[i]['star']);
                        }
                    }
                    if (this.store.length==0){
                        $('#shopNoData').html(this.nodata);
                    }else {
                        $('#shopNoData').html("");
                    }
                    /*var _this = this;
                    setTimeout(function () {
                        _this.loading = false;
                    }, 300);*/
                    this.loading = false;
                }, function (res) {

                });
            },
            jumpProduct:function (list) {
                // console.log(list);
                if (list.is_shelves == 1){
                    location.href = "/userweb/index/productInfo.html?productId="+list.product_id;
                }else {
                    layer.msg("该商品已失效</br>The product is invalid",{
                        skin:'winning-class',
                        time:3000
                    });
                }
            },
            entera:function (e) {
                var el = e.target;
                $(el).children(".good_href_box").show();
            },
            leavea:function (e) {
                var el = e.target;
                $(el).children(".good_href_box").hide();
            },
            collectProduct: function (index) {
                this.loading    = true;
                this.classification = false;
                this.paginate   = ''; //分页
                this.page_type  = 1;
                if (index == 0){    //全部
                    this.type = 0;
                }
                if (index == -1){   //失效
                    this.type = -1;
                }
                if (index == 1){   //六个月前
                    this.type = 1;
                }
                if (index == 2){   //一年前
                    this.type = 2;
                }
                var url = '/api/Collection/collectProduct';
                var data = {
                    user_id:        this.user_id,
                    type:           this.type,
                    page_no:        this.pageNo,
                    typeSos:        'web'
                };
                this.$http.post(url, data, {
                    emulateJSON: true
                }).then(function (res) {
                    if (res.data.status == 200) {
                        this.paginate   = res.data.paginate; //分页
                        if (this.type == 0){
                            this.product    = res.data.collect.data;
                            for (var i=0;i<this.product.length;i++){
                                this.product[i]['image']  = this.oss_url+this.product[i]['image'];
                                if (this.product[i]['packing_proportion'] == 1){
                                    this.product[i]['packing_proportion'] = '';
                                }
                            }
                        }else {
                            this.loseProduct    = res.data.collect.data;
                            for (var k=0;k<this.loseProduct.length;k++){
                                this.loseProduct[k]['image']  = this.oss_url+this.loseProduct[k]['image'];
                            }
                        }
                    }
                    if (this.product.length==0 && this.type==0){   //全部商品
                        $('#allNoData').html(this.nodata);
                    }else {
                        $('#allNoData').html("");
                    }
                    if (this.loseProduct.length==0 && this.type!=0){   //失效商品
                        $('#expiredNoData').html(this.nodata);
                        $('.delete_btn_box').hide();
                    }else {
                        $('#expiredNoData').html("");
                        $('.delete_btn_box').show();
                    }
                    /*var _this = this;
                    setTimeout(function () {
                        _this.loading = false;
                    }, 300);*/
                    this.loading = false;
                }, function (res) {

                });
            },
            delLoseProduct:function () {
                if (this.type == 0){
                    return false;
                }
                var url = '/userweb/Homepage/delLoseProduct';
                var data = {
                    user_id:        this.user_id,
                    type:           this.type
                };
                this.$http.post(url, data, {
                    emulateJSON: true
                }).then(function (res) {
                    if (res.data.status == 200) {
                        layer.msg("删除成功</br>Delete success",{
                            skin:'winning-class',
                            time:3000
                        });
                    }
                    var _this = this;
                    setTimeout(function () {
                        _this.collectProduct(this.type);
                    }, 500);
                }, function (res) {

                });
            },
            ini:function () {
                var url = '/api/Collection/CollectClassify';
                var data = {

                };
                this.$http.post(url, data, {
                    emulateJSON: true
                }).then(function (res) {
                    if (res.data.status == 200) {
                        this.classify = res.data.classify.list;
                    }
                }, function (res) {

                });
            },
            dropDown:function (index) {
                if (index == 1){
                    this.categories = true;
                }
                if (index == 2){
                    this.categories = false;
                }
            },
            showSelect:function(){
                if(this.show == false){
                    $('.select_search_img').find('img').css('transform','rotate(180deg)');
                    $('#baseData').css('display','block');
                    this.show = true;
                }else {
                    $('.select_search_img').find('img').css('transform','rotate(360deg)');
                    $('#baseData').css('display','none');
                    this.show = false;
                }
            },
            clickSelect:function (index,list) {
                if (index == 1){
                    this.supplier_type = list.id;
                    var text = list.name+'/'+list.name_english;
                    $('.select_show').text(text);
                }
                if (index == 2){
                    this.collectSupplier();
                }
                if (index == 3){
                    this.supplier_type = '';
                    var text = '全部分类／All Categories';
                    $('.select_show').text(text);
                }
            }
        },
        mounted: function () {
            this.nodata += '<div class="my_no-data">';
            this.nodata += '<div class="no_data_tip">';
            this.nodata += '<img src="/image/userweb/slicesImg/no-data.png" alt="">';
            this.nodata += '<div class="no-data-text">';
            this.nodata += '<div class="title_zh">暂无数据</div>';
            this.nodata += '<div class="title_en">No data</div>';
            this.nodata += '</div>';
            this.nodata += '</div>';
            this.nodata += '</div>';
            this.user_id        = localStorage.getItem('user_id');
            this.user_name      = localStorage.getItem('user_name');
            this.city           = localStorage.getItem('city');
            this.web_token      = localStorage.getItem('web_token');
            if (!this.user_id ){
                location.href = "/userweb/index/login.html";
            }
            this.collectProduct(0);
            this.ini();
        }
    });
function ajaxPage(page) {
    if (vm.page_type == 1){
        vm.pageNo = page;
        vm.collectProduct();
    }
    if (vm.page_type == 2){
        vm.page_no = page;
        vm.collectSupplier();
    }
}
function jump(){
    var page = $("#page_no").val();
    vm.pageNo = page;
    vm.collectProduct();
}
function JumTwo(){
    var page = $("#pageNo").val();
    vm.page_no = page;
    vm.collectSupplier();
}